<template>
  <basic-container>
    <avue-crud
      :data="tableData"
      :option="tableOption"
      :table-loading="Loading"
      :page.sync="page"
      @on-load="onLoad"
      @refresh-change="onLoad"
    >
      <template slot-scope="scope" slot="name">
        <el-link :underline="false" type="primary" :href="'#/quality/errorNode/' + scope.row.id + '?id=' + scope.row.id" >{{scope.row.name}}</el-link>
      </template>
      <template slot-scope="scope" slot="state">
        {{_rtState(scope.row.state)}}
      </template>
      <template slot-scope="scope" slot="menu">
        <router-link @click.native="routerLinkClick(scope.row)" :to="{ path: '/projects/instance/details/' + scope.row.id , query:{id: scope.row.processDefinitionId}}" tag="a" class="links">
          <el-link :underline="false" type="primary">流程详情</el-link>
        </router-link>
      </template>
    </avue-crud>
  </basic-container>
</template>
<script>
  import { tasksState, runningType } from '@/view-module/dolphin-scheduler/pages/dag/_source/config'
  import { mapActions } from 'vuex'
  import mLog from '../metadata/log';
  import { getErrorLogList } from '@/api/quality/errorLog';
  export default {
    components: { mLog },
    data(){
      return {
        type: 4,
        tasksState:tasksState,
        page: {
          pageSize: 10,
          currentPage: 1,
          total: 0
        },
        tableData:[],
        Loading: false,
        tableOption: {
          // height: 'auto',
          // calcHeight: 30,
          tip: false,
          searchShow: true,
          searchMenuSpan: 6,
          border: false,
          editBtn: false,
          addBtn: false,
          delBtn: false,
          // viewBtn: true,
          // delBtn: false,
          // menuWidth: 350,
          dialogClickModal: false,
          menuWidth: 180,
          column: [
            {
              label: '实例ID',
              prop: 'id'
            },
            {
              label: '名称',
              prop: 'name',
              width: 200
            },
            {
              label: '状态',
              prop: 'state'
            },
            {
              label: '调度时间',
              prop: 'scheduleTime',
              type: "date",
              format: "yyyy-MM-dd hh:mm:ss",
              width: 140
            },
            {
              label: '开始时间',
              prop: 'startTime',
              type: "date",
              format: "yyyy-MM-dd hh:mm:ss",
              width: 140
            },
            {
              label: '结束时间',
              prop: 'endTime',
              type: "date",
              format: "yyyy-MM-dd hh:mm:ss",
              width: 140
            },
            {
              label: 'host',
              prop: 'host'
            },
            {
              label: '操作人',
              prop: 'executorName'
            }

          ]
        },
        searchParams: {
          // Search keywords
          searchVal: '',
          // Number of pages
          pageSize: 10,
          // Current page
          pageNo: 1,
          // host
          host: '',
          // State
          stateType: '',
          // Start Time
          startDate: '',
          // End Time
          endDate: '',
          // Exectuor Name
          executorName: ''
        }
      }
    },
    methods: {
      ...mapActions('dag', ['getProcessInstance']),
      onLoad() {
        this._getProcessInstanceListP();
      },
      _rtState (code) {
        let o = this.tasksState[code];
        return o?o.desc:''
      },
      /**
       * get list data
       */
      _getProcessInstanceListP () {
        this.searchParams.pageNo = this.page.currentPage;
        this.searchParams.pageSize = this.page.pageSize;
        this.getProcessInstance({
          ...this.searchParams,
          type: this.type
        }).then(res => {
          if (this.searchParams.pageNo > 1 && res.totalList.length === 0) {
            this.searchParams.pageNo = this.searchParams.pageNo - 1
          } else {
            this.tableData = []
            this.tableData = res.totalList
            this.page.total = res.total
            this.isLoading = false
          }
        }).catch(e => {
          this.isLoading = false
        })
      }
    }
  }
</script>
<style lang="scss">
  .content-log {
    height: 50vh;
    background: #002A35;
    padding:6px 2px;
    .content-log-box {
      width: 100%;
      height: 100%;
      word-break:break-all;
      textarea {
        background: none;
        color: #9CABAF;
        border: 0;
        font-family: 'Microsoft Yahei,Arial,Hiragino Sans GB,tahoma,SimSun,sans-serif';
        font-weight: bold;
        resize:none;
        line-height: 1.6;
        padding: 0px;
      }
    }
  }
</style>
